<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="./css/index.css">
</head>
<body>
<div class="content" style="margin-top: 30px">
    <a class="card" href="#">
        <div class="front" style="background-image: url('./images/00008.jpg');">
            <p>新石器时代马家窑文化马厂类型彩绘菱形四圆圈纹双系陶壶</p>
        </div>
        <div class="back">
            <div>
                <p>Consectetur adipisicing elit. Possimus, praesentium?</p>
                <p>Provident consectetur natus voluptatem quis tenetur sed beatae eius sint.</p>
                <button class="button">Click Here</button>
            </div>
        </div>
    </a>
    <a class="card" href="#">
        <div class="front" style="background-image: url(https://picsum.photos/300/401/?image=560);">
            <p>Lorem ipsum dolor sit amet consectetur adipisi.</p>
        </div>
        <div class="back">
            <div>
                <p>Consectetur adipisicing elit. Possimus, praesentium?</p>
                <p>Provident consectetur natus voluptatem quis tenetur sed beatae eius sint.</p>
                <button class="button">Click Here</button>
            </div>
        </div>
    </a>
    <a class="card" href="#">
        <div class="front" style="background-image: url(https://picsum.photos/300/401/?image=567);">
            <p>Lorem ipsum dolor sit amet consectetur adipisi.</p>
        </div>
        <div class="back">
            <div>
                <p>Consectetur adipisicing elit. Possimus, praesentium?</p>
                <p>Provident consectetur natus voluptatem quis tenetur sed beatae eius sint.</p>
                <button class="button">Click Here</button>
            </div>
        </div>
    </a>
    <a class="card" href="#">
        <div class="front" style="background-image: url(https://picsum.photos/300/401/?image=562);">
            <p>Lorem ipsum dolor sit amet consectetur adipisi.</p>
        </div>
        <div class="back">
            <div>
                <p>Consectetur adipisicing elit. Possimus, praesentium?</p>
                <p>Provident consectetur natus voluptatem quis tenetur sed beatae eius sint.</p>
                <button class="button">Click Here</button>
            </div>
        </div>
    </a>
    <a class="card" href="#">
        <div class="front" style="background-image: url(https://picsum.photos/300/401/?image=563);">
            <p>Lorem ipsum dolor sit amet consectetur adipisi.</p>
        </div>
        <div class="back">
            <div>
                <p>Consectetur adipisicing elit. Possimus, praesentium?</p>
                <p>Provident consectetur natus voluptatem quis tenetur sed beatae eius sint.</p>
                <button class="button">Click Here</button>
            </div>
        </div>
    </a>
    <a class="card" href="#">
        <div class="front" style="background-image: url(https://picsum.photos/300/401/?image=564);">
            <p>Lorem ipsum dolor sit amet consectetur adipisi.</p>
        </div>
        <div class="back">
            <div>
                <p>Consectetur adipisicing elit. Possimus, praesentium?</p>
                <p>Provident consectetur natus voluptatem quis tenetur sed beatae eius sint.</p>
                <button class="button">Click Here</button>
            </div>
        </div>
    </a>
</div>
</body>
</html>